import { defineComponent, ref, toRefs } from 'vue'
import './index.less'
import { Pagination } from 'ant-design-vue'
import { PaginationType } from './type'
import PropTypes from '@/utils/PropTypes'
export default defineComponent({
  name: 'PaginationCom',
  props: {
    pageination: PropTypes.object<PaginationType>().def({
      current: 1,
      pageSize: 10,
      total: 0,
    }),
  },
  emits: ['update:pageinations'],
  setup(props, { emit }) {
    const { pageination } = toRefs(props)
    const onchange = (page: number, pageSize: number) => {
      emit('update:pageinations', {
        current: page,
        pageSize,
        total: pageination.value.total,
      })
    }
    return () => (
      <div class="pagination-com">
        <Pagination
          v-model:current={pageination.value.current}
          total={pageination.value.total}
          showSizeChanger
          showQuickJumper
          hideOnSinglePage
          onChange={onchange}
        />
      </div>
    )
  },
})
